import  Vue from 'vue';
import Vuex from 'vuex';
//https://baijiahao.baidu.com/s?id=1618794879569468435&wfr=spider&for=pc
//使用vuex
Vue.use(Vuex);

//创建vuex实例
const store = new Vuex.Store({
  //vuex中的数据源，我们需要保存的数据就保存在state这里，
  // 可以在页面通过 this.$store.state来获取我们定义的数据；
  state:{
    count:1
  },

  getters:{ //类似vue的computed
    getStateCount:function (state) { //上面的state
      return state.count +1;
    }
  },

  //修改store中的值唯一的方法就是提交mutation来修改
  mutations:{
    add(state){  //commit调用add时只需指明方法名   $store.commit('add');
      state.count +=1;
    },
    reduction(state , n){  //commit调用reduction时需指明方法名 , 参数n   如：  $store.commit('reduction' ,n);
      state.count -= n;
    }

  },

  actions:{ //注册action (vuex官方不允许直接调用mutations的方法，须使用actions 间接调用)
    addFun(context){ //context指的是store实例
      context.commit('add');
    },
    reductionFun(context , n){ //context指的是store实例
      context.commit('reduction' , n);
    }
  }










});

export default store;
